<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <ul id="test"></ul>
    <script>
      var ul = document.getElementById('test');
      for (var i = 0; i < 10; i++) {
        var li = document.createElement('li');
        li.innerHTML = i + '';
        li.addEventListener(
          'click',
          (function (index) {
            return function (e) {
              e.preventDefault()
              alert(index)
            }
          })(i)
        );
        ul.appendChild(li);
      }
      Function.prototype.myBind = function() {
        var args = Array.from(arguments);
        var target = args.shift();
        var self = this;
        return function () {
          var newArg = args.concat(Array.prototype.slice.call(arguments));
          self.apply(target,newArg);
        }
      }
      function sum(a) {
        console.log(this.num+a);
      }
      sum.myBind({num:12})(1);
      sum.myBind({num:12},1)();
    </script>
  </body>
</html>
